<html>
<head>
    <meta http-equiv='Content-Type' content='text/html;charset=utf-8' />
    <link rel='stylesheet' href='../css/base.css' />
    <link rel='stylesheet' href='css/MultipleTab.css' />
</head>
<body>
<style>
    #add-tabs {
        background-color:red;
        color:white;
        border-radius:3px;
        padding:5px;
        font-size:14px;
        margin:12px;
        cursor:pointer;
    }
</style>
<div class="container">
    <!--
        2017-09-12 15:07:00 author 陈学龙
        多标签页切换
    -->
    <div class="multiple-tab">
        <!-- 项列表 -->
        <div class="tabs">

            <!-- 开发时保留！ -->
            <div class="tab">
                <div class="ico"><img src="image/icon.ico" class="image" /></div>
                <div class="text">控制台</div>
                <div class="close">
                    <div class="positive"></div>
                    <div class="negative"></div>
                </div>
            </div>

        </div>
    </div>

</div>、
<div class="btn-list">
    <button id="add-tabs">添加标签</button>
</div>

<script src='../SmallJs/SmallJs.js'></script>
<script src='js/MultipleTab.js'></script>
<script>
    (function(){
        'use strict';

        var btn = G('#add-tabs');

        var con = G('.container');

        var mt = new MultipleTab(con.get(0) , {

        });

        var opt = null;

        var i = 0;

        btn.on('click' , function(){
            opt = {
                text: '测试标签标题-' + ++i ,
                ico: 'image/icon.ico'
            };

            mt.create(opt);
        } , true , false);
    })();
</script>
</body>
</html>